<template>
	<view class="mine" >
		<view class="mineBox">
			<view class="mine_top">
				<view class="userInfo">
					
					<!-- #ifdef APP-PLUS -->
					<view class="status_bar">
					  <!-- 这里是状态栏 -->
					</view>
					<!-- #endif -->
					<!-- <view class="Header">
						<view class="top_l" @click="switchBtn">
							<view class="personal-icon1"><image src="/static/index/personal1.png" mode=""></image></view>
							<view class="personal-icon2"><image src="/static/index/personal-icon2.png" mode=""></image></view>
						</view>
						<view class="HeaderC">
							<view class="screenItem" @click="downBox">
								<view class="screenName">{{popupName}}</view>
								<u-icon name="arrow-down" size="16" color="#666"></u-icon>
								<view class="HeaderBox" v-if="isShow">
									<view class="HeaderBoxT" @click="headerBtn1">
										顺风接单
									</view>
									<view class="HeaderBoxT2" @click="headerBtn2">
										实时在线
									</view>
								</view>
							</view>
							
						</view>
						<view class="HeaderB">
							<image src="../../static/find/10.png" mode=""></image>
						</view>
					</view> -->
					<view class="personal">
						
						<view class="personalImage">
							<u-avatar v-if="!userMsg.image_url" :src="src" mode="circle" size="96" :show-sex="true" sex-icon="woman"></u-avatar>
							<!-- <image :src="getImage(userMsg.image_url)" v-if="userMsg.image_url"></image> -->
							<view v-if="userMsg.image_url" :style="{'background-image':'url('+getImage(userMsg.image_url)+')'}"></view>
						</view>
						<view class="personalInfo">
							
							<view class="personalNameBox">
								<view class="personalName" v-if="userMsg.id">{{userMsg.username?userMsg.username:"无"}}</view>
								<view class="personalName" v-else @click="toLogin">请登录</view>
								<view @click="toMySettings">
									<u-icon name="setting" size="45" color="#666"></u-icon>
								</view>
							</view>
							<view class="cardBox" @click="toBusinessCard" v-if="isStore&&userMsg.id">
								<view class="cardImage">
									<image src="/static/mine/card.png" mode=""></image>
								</view>
								<view class="cardName">达人名片</view>
								<view class="cardCont">发布了内容{{conNum}}条，收获了{{giveNum}}赞</view>
								<u-icon name="arrow-right" color="#FFAC3F" size="25"></u-icon>
							</view>
							<view class="cardBox" v-if="!isStore&&userMsg.id">
								<view class="cardImage" @click="toMyStore">
									<image src="/static/mine/store.png" mode=""></image>
								</view>
								<view class="cardName" @click="toMyStore">我的门店</view>
								<!-- <view class="cardCont" @click="toStoreManagement">门店管理</view> -->
							</view>
						</view>
					</view>
					<view class="optionBox">
						<view class="optionItem" @click="toMyRrelease" v-if="isStore">
							<view class="optionImage">
								<image src="/static/mine/release.png" mode=""></image>
							</view>
							<view class="optionName">发布内容</view>
						</view>
						<view class="optionItem" v-if="!isStore" @click="toReleaseEvaluation">
							<view class="optionImage">
								<image src="/static/mine/release.png" mode=""></image>
							</view>
							<view class="optionName">发布测评</view>
						</view>
						<view class="optionItem" @click="toGroupOrder" v-if="!isStore">
							<view class="optionImage">
								<image src="/static/mine/groupOrder.png" mode=""></image>
							</view>
							<view class="optionName">团单管理</view>
						</view>
						<view class="optionItem" @click="toReleaseHis" v-if="!isStore">
							<view class="optionImage">
								<image src="/static/mine/groupOrder.png" mode=""></image>
							</view>
							<view class="optionName">测评管理</view>
						</view>
						<view class="optionItem" @click="toCollection" v-if="isStore">
							<view class="optionImage">
								<image src="/static/mine/collects.png" mode=""></image>
							</view>
							<view class="optionName">收藏内容</view>
						</view>
						
						<view class="optionItem" @click="toHistoricalRecords" v-if="isStore">
							<view class="optionImage">
								<image src="/static/mine/footprint.png" mode=""></image>
							</view>
							<view class="optionName">浏览历史</view>
						</view>
					</view>
				</view>
				<view class="balanceBox">
					<view class="balanceNameBox">
						<view class="balanceTitle">我的余额</view>
						<view class="detailedBox" @click="toMyBalance">
							<view class="detailed">查看明细</view>
							<u-icon name="arrow-right" color="#D0D0D0" size="20"></u-icon>
						</view>
					</view>
					<view class="balancePrice">￥{{userMsg.allMoney?userMsg.allMoney:0}}</view>
					<view class="operationBtn">
						<view class="operationItem" @click="toWithdrawal">提现</view>
						<view class="operationItem" @click="toRecharge">充值</view>
						<!-- <view class="operationItem" @click="toInvitationPromotion">邀请推广</view> -->
					</view>
				</view>
			</view>
			<view class="orderBox" v-if="isStore">
				<view class="ordertitle">我的订单</view>
				<view class="orderList">
					<view class="orderItem" v-for="(item,index) in Myorder" @click="toMyOrder(index)">
						<view class="orderImage">
							<image :src="item.icon" mode=""></image>
						</view>
						<view class="orderName">{{item.name}}</view>
					</view>
				</view>
			</view>
			<view class="orderBox" v-if="!isStore">
				<view class="ordertitle">订单管理</view>
				<view class="orderList">
					<view class="orderItem" @click="toOrderManagement(index)" v-for="(item,index) in management">
						<view class="orderImage">
							<image :src="item.icon" mode=""></image>
						</view>
						<view class="orderName">{{item.name}}</view>
					</view>
				</view>
			</view>
			<view class="orderBox" v-if="isStore">
				<view class="ordertitle" @click="toCreation">我的创作</view>
				<view class="orderList">
					<view class="orderItem" @click="toCreation" data-index="1">
						<view class="orderImage">
							<image src="/static/mine/invitation.png" mode=""></image>
						</view>
						<view class="orderName">被邀请</view>
					</view>
					<view class="orderItem" @click="toCreation" data-index="3">
						<view class="orderImage">
							<image src="/static/mine/conduct.png" mode=""></image>
						</view>
						<view class="orderName">待预约</view>
					</view>
					<view class="orderItem" @click="toCreation" data-index="5">
						<view class="orderImage">
							<image src="/static/mine/received.png" mode=""></image>
						</view>
						<view class="orderName">待交稿</view>
					</view>
					<view class="orderItem" @click="toCreation" data-index="9">
						<view class="orderImage">
							<image src="/static/mine/complete.png" mode=""></image>
						</view>
						<view class="orderName">已完成</view>
					</view>
				</view>
			</view>
			<view class="orderBox" v-if="!isStore">
				<view class="ordertitle">
					<view class="ordertitleL">营销管理</view>
					<!-- <view class="ordertitleR" @click="toReleaseHis">
						<text>全部测评</text>
						<image src="../../static/mine/more.png"></image>
					</view> -->
				</view>
				<view class="orderList" @click="toCreation">
					<view class="orderItem" @click.stop="toCreation" data-index="1">
						<view class="orderImage">
							<image src="/static/mine/invitation.png" mode=""></image>
						</view>
						<view class="orderName">已邀请</view>
					</view>
					<view class="orderItem" @click.stop="toCreation" data-index="2">
						<view class="orderImage">
							<image src="/static/mine/conduct.png" mode=""></image>
						</view>
						<view class="orderName">待确认</view>
					</view>
					<view class="orderItem" @click.stop="toCreation" data-index="6">
						<view class="orderImage">
							<image src="/static/mine/received.png" mode=""></image>
						</view>
						<view class="orderName">待审核</view>
					</view>
					<view class="orderItem" @click.stop="toCreation" data-index="9">
						<view class="orderImage">
							<image src="/static/mine/complete.png" mode=""></image>
						</view>
						<view class="orderName">已完成</view>
					</view>
				</view>
			</view>
			<view style="text-align: center;margin: 30upx 0 15upx;font-size: 20upx;">Copyright@2021</view>
			<view style="text-align: center;margin-bottom: 30upx;font-size: 20upx;">湖北若免互联网信息科技服务有限公司 版权所有</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	const app = getApp();
	export default {
		data() {
			return {
				src: '../../static/index/index_content.png',
				isStore:true,
				statusBarHeight:0,
				currents:0,
				isShow:false,
				popupName:"顺风接单",
				popupList:[{name:"顺风接单"},{name:"实时在线"}],
				Myorder:[{name:"待付款",icon:"/static/mine/payment.png"},{name:"待使用",icon:"/static/mine/use.png"},{name:"待评价",icon:"/static/mine/evaluate.png"},{name:"退款/售后",icon:"/static/mine/refund.png"}],
				management:[{name:"券码核销",icon:"/static/mine/Write.png"},{name:"售卖份额",icon:"/static/mine/Sell.png"},{name:"核销记录",icon:"/static/mine/record.png"},{name:"退款/售后",icon:"/static/mine/refund.png"}],
				userMsg:{},
				conNum:0,
				giveNum:0
			}
		},
		onShow() {
      // #ifdef APP-PLUS
      var args = plus.runtime.arguments;
      if(args){
        app.$vm.setShareDetail(args);
      }
      // #endif
			// this.isStore = uni.getStorageSync('identity');
			if(uni.getStorageSync('identity')){
				this.isStore = false;
			}else{
				this.isStore = true;
			}
			if(uni.getStorageSync("rmToken")){
				this.getUser();
			}else{
				this.userMsg = {};
				this.conNum = 0;
				this.giveNum = 0;
			}
		},
		methods: {
			toLogin(){
				// #ifdef MP-WEIXIN
				uni.navigateTo({
					url:"/pages/pagefive/pages/wxLogin/wxLogin"
				})
				// #endif
				// #ifdef APP-PLUS
				uni.navigateTo({
					url:"/pages/pagethree/pages/Login/Login"
				})
				// #endif
				// #ifdef MP-TOUTIAO
				uni.navigateTo({
					url:"/pages/pagethree/pages/Login/Login"
				})
				// #endif
			},
			getImage(url){
				if(url&&(url.indexOf("http://")!=-1||url.indexOf("https://")!=-1)){
					return url;
				}else{
					return app.$vm.globalData.imgBaseUrl + url;
				}
			},
			toWithdrawal(){
				// #ifdef MP-WEIXIN
				// uni.navigateTo({
				// 	url:"/pages/pagefive/pages/withdrawal/withdrawal"
				// })
				uni.showModal({
					content:"因系统限制，提现功能请至app版本。后续版本中我们将优化这一功能，敬请期待!"
				})
				// #endif
				// #ifdef APP
				uni.navigateTo({
					url:"/pages/pagefive/pages/withdrawal/withdrawal"
				})
				
				// #endif
			},
			toGroupOrder(){
				uni.navigateTo({
					url:"/pages/pagetwo/pages/groupList/groupList"
				})
			},
			getUser(){
				this.$u.api.userDetails({user_id:uni.getStorageSync("userId")}).then(res=>{
					console.log(res)
					res.data.data.allMoney = (Number(res.data.data.money) + Number(res.data.data.frozen_money)).toFixed(2);
					this.userMsg = res.data.data;
				})
				this.$u.api.shareSum({user_id:uni.getStorageSync("userId")}).then(res=>{
					console.log(res)
					this.giveNum = res.data.data;
				})
				this.$u.api.shareCount({user_id:uni.getStorageSync("userId")}).then(res=>{
					console.log(res)
					this.conNum = res.data.data;
				})
			},
			toCreation(e){
				let index = e.target.dataset.index || e.currentTarget.dataset.index;
				if(index){
					if(this.isStore){
						uni.navigateTo({
							url:"/pages/pagethree/pages/myCreation/myCreation?form=user&type="+index
						})
					}else{
						uni.navigateTo({
							url:"/pages/pagethree/pages/myCreation/myCreation?form=shop&type="+index
						})
					}
				}else{
					if(this.isStore){
						uni.navigateTo({
							url:"/pages/pagethree/pages/myCreation/myCreation?form=user"
						})
					}else{
						uni.navigateTo({
							url:"/pages/pagethree/pages/myCreation/myCreation?form=shop"
						})
					}
					
				}
			},
			//切换身份
			switchBtn(){
				uni.showModal({
					title:"是否切换身份？",
					showCancel:true,
					success(res) {
						if(res.confirm){
							uni.$emit('ServerIndex-page',true);
						}
					}
				})
			},
			downBox(){
				this.isShow=!this.isShow
			},
			headerBtn1(){
				this.popupName="顺风接单"
			},
			headerBtn2(){
				this.popupName="实时在线"
			},
			ownBox(index){
				this.isScreen = true
				// this.isScreen = !this.isScreen
				console.log(this.isScreen);
				this.currents = index
			},
			toReleaseHis(){
				uni.navigateTo({
					url:"/pages/pagefour/pages/ReleaseEvaluation/ReleaseEvaluation"
				})
			},
			//邀请推广
			toInvitationPromotion(){
				uni.navigateTo({
					url:"/pages/pagethree/pages/Invitation-promotion/Invitation-promotion"
				})
			},
			//门店管理
			toStoreManagement(){
				uni.navigateTo({
					url:"/pages/pagefive/pages/StoreManagement/StoreManagement"
				})
			},
			//我的设置
			toMySettings(){
				uni.navigateTo({
					url:"/pages/pagethree/pages/MySettings/MySettings"
				})
			},
			//我的订单
			toMyOrder(index){
				if(index!=3){
					uni.navigateTo({
						url:"/pages/pagethree/pages/MyOrder/MyOrder?index="+(index+1)
					})
				}else{
					uni.navigateTo({
						url:"/pages/pagethree/pages/MyOrder/MyOrder?index=5"
					})
				}
			},
			//订单管理
			toOrderManagement(index){
				let _this = this;
				if(index==0){
					uni.scanCode({
						success(res) {
							console.log(res)
							let q = res.result;
							console.log(q)
							let id = app.$vm.getArgs(q, "id");
							let pid = app.$vm.getArgs(q, "pid");
							console.log(id)
							uni.navigateTo({
								url:"/pages/pageone/pages/choiceStore/choiceStore?userid="+pid+"&oid="+id
							})
						}
					})
				}else{
					uni.navigateTo({
						url:"/pages/pagefour/pages/OrderManagement/OrderManagement?index="+index
					})
				}
			},
			//发布测评
			toReleaseEvaluation(){
				uni.navigateTo({
					url:"/pages/pagefour/pages/releaseEva/releaseEva"
				})
			},
			//充值
			toRecharge(){
				uni.navigateTo({
					url:"/pages/pagefour/pages/Recharge/Recharge"
				})
			},
			//我的门店
			toMyStore(){
				uni.navigateTo({
					url:"/pages/pagethree/pages/MyStore/MyStore"
				})
			},
			//查看明细
			toMyBalance(){
				uni.navigateTo({
					url:"/pages/pagethree/pages/MyBalance/MyBalance"
				})
			},
			//历史记录
			toHistoricalRecords(){
				uni.navigateTo({
					url:"/pages/pagethree/pages/Historical-records/Historical-records"
				})
			},
			//发布
			toMyRrelease(){
				uni.navigateTo({
					url:"/pages/pagefour/pages/Release/Release"
				})
			},
			//收藏
			toCollection(){
				uni.navigateTo({
					url:"/pages/pageone/pages/Collection/Collection"
				})
			},
			//名片
			toBusinessCard(){
				uni.navigateTo({
					url:"/pages/pageone/pages/Business-card/Business-card?id="+uni.getStorageSync("userId")
				})
			}
		}
	}
</script>

<style scoped lang="less">
.mine{
	background-color: #F3F3F3;
	// height: calc(100vh - 100upx);
	height: 100vh;
	overflow: auto;
	// padding-bottom: 64upx;
	.status_bar{
		height: var(--status-bar-height);
		width: 100%;
	}
	.mineBox{
		.mine_top{
			height: 600upx;
			// #ifdef APP
			height: 640upx;
			// #endif
			position: relative;
			.userInfo{
				background-color: #F9ECEB;
				width: 750upx;
				padding: 32upx 24upx 100upx 24upx;
				.Header{
					display: flex;
					justify-content: space-between;
					.top_l{
						width: 44upx;
						height: 44upx;
						margin-top: 8upx;
						position: relative;
						.personal-icon1{
							width: 32upx; 
							height: 32upx;
							image{
								width: 100%;
								height: 100%;
							}
						}
						.personal-icon2{
							position: absolute;
							bottom: 30upx;
							right: 0;
							width: 12upx;
							height: 12upx;
							image{
								width: 100%;
								height: 100%;
							}
						}
					}
					.HeaderC{
						.screenItem{
							display: flex;
							justify-content: center;
							align-items: center;
							min-width: 112upx;
							height: 48upx;
							position: relative;
							// background: #E5E5E5;
							// opacity: 1;
							// border-radius: 22upx;
							// padding: 16upx 24upx;
							box-sizing: border-box;
							// margin-right: 48upx;
							.screenName{
								font-size: 28upx;
								font-family: Source Han Sans CN;
								font-weight: 400;
								line-height: 48upx;
								color: #666666;
								margin-right: 8upx;
							}
							.HeaderBox{
								position: absolute;
								bottom: -100upx;
								left: -4upx;
								width: 138upx;
								height: 100upx;
								background-color: #FFFFFF;
								text-align: center;
								border-radius: 0 0 12upx 12upx;
								.HeaderBoxT{
									font-size: 28upx;
									margin-top: 4upx;
								}
								.HeaderBoxT2{
									font-size: 28upx;
									margin-top: 4upx;
								}
							}
						}
					}
					.HeaderB{
						width: 48upx;
						height: 48upx;
						image{
							width: 100%;
							height: 100%;
							vertical-align: top;
						}
					}
				}
				.personal{
					display: flex;
					align-items: center;
					// margin-top: 52upx;
					.personalImage{
						width: 96upx;
						height: 96upx;
						border-radius: 50%;
						// overflow: hidden;
						margin-right: 28upx;
						// background-color: #F0AD4E;
						view{
							width: 96upx;
							height: 96upx;
							border-radius: 50%;
							background-position: center;
							background-size: cover;
						}
					}
					.personalInfo{
						width: calc(100% - 124upx);
						
						.personalNameBox{
							display: flex;
							justify-content: space-between;
							align-items: center;
							.personalName{
								font-size: 28upx;
								font-family: Source Han Sans CN;
								font-weight: bold;
								color: #333333;
							}
						}
						.cardBox{
							display: flex;
							align-items: center;
							margin-top: 16upx;
							.cardImage{
								width: 32upx;
								height: 32upx;
								image{
									width: 100%;
									height: 100%;
								}
							}
							.cardName{
								font-size: 20upx;
								font-family: Source Han Sans CN;
								font-weight: 400;
								color: #FFAC3F;
								margin-left: 4upx;
							}
							.cardCont{
								font-size: 20upx;
								font-family: Source Han Sans CN;
								font-weight: 400;
								color: #999999;
								margin: 0 16upx;
							}
						}
					}
				}
				.optionBox{
					display: flex;
					justify-content: space-around;
					align-items: center;
					margin-top: 48upx;
					.optionItem{
						display: flex;
						flex-direction: column;
						align-items: center;
						justify-content: center;
						.optionImage{
							width: 48upx;
							height: 48upx;
							image{
								width: 100%;
								height: 100%;
							}
						}
						.optionName{
							font-size: 24upx;
							font-family: Source Han Sans CN;
							font-weight: 400;
							color: #666666;
							margin-top: 16upx;
						}
					}
				}
			}
			.balanceBox{
				position: absolute;
				bottom: 0;
				left: 50%;
				transform: translateX(-50%);
				width: 702upx;
				background: #FFFFFF;
				opacity: 1;
				border-radius: 20upx;
				padding: 24upx;
				.balanceNameBox{
					display: flex;
					align-items: center;
					justify-content: space-between;
					.balanceTitle{
						font-size: 28upx;
						font-family: Source Han Sans CN;
						font-weight: 500;
						color: #333333;
					}
					.detailedBox{
						display: flex;
						align-items: center;
						.detailed{
							font-size: 20upx;
							font-family: Source Han Sans CN;
							font-weight: 400;
							color: #D0D0D0;
							margin-left: 8upx;
						}
					}
				}
				.balancePrice{
					font-size: 45upx;
					color: #333333;
					font-weight: bold;
					margin: 32upx 0;
				}
				.operationBtn{
					display: flex;
					align-items: center;
					justify-content: flex-end;
					// justify-content: space-around;
					.operationItem{
						background: #FFAC3F;
						opacity: 1;
						border-radius: 22upx;
						padding: 12upx 32upx;
						font-size: 22upx;
						font-family: Source Han Sans CN;
						font-weight: 400;
						color: #FFFFFF;
						margin-right: 32upx;
					}
				}
			}
		}
		.orderBox{
			width: 702upx;
			background: #FFFFFF;
			opacity: 1;
			border-radius: 20upx;
			padding: 24upx 32upx;
			margin: 32upx auto 0;
			.ordertitle{
				font-size: 24upx;
				font-family: Source Han Sans CN;
				font-weight: 500;
				color: #333333;
				margin-bottom: 32upx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				.ordertitleL{
					font-size: 24upx;
				}
				.ordertitleR{
					display: flex;
					align-items: center;
					justify-content: space-between;
					text{
						font-size: 24upx;
					}
					image{
						width: 32upx;
						height: 32upx;
					}
				}
			}
			.orderList{
				display: flex;
				justify-content: space-around;
				align-items: center;
				.orderItem{
					display: flex;
					flex-direction: column;
					justify-content: center;
					align-items: center;
					.orderImage{
						width: 70upx;
						height: 70upx;
						image{
							width: 100%;
							height: 100%;
						}
					}
					.orderName{
						font-size: 20upx;
						font-family: Source Han Sans CN;
						font-weight: 400;
						color: #333333;
						margin-top: 16upx;
					}
				}
			}
		}
	}
}
</style>
